<template>
  <div class="evaluate-tags">
    <span class="tag" v-for="item in evaluateTags" :key="item" :class="{ active: evaluateTags === item }">{{ item }}</span>
  </div>
</template>

<script>
export default {
  name: 'EvaluateDetailTags',
  props: {
    evaluateTags: {
      type: String,
      default: null
    }
  }
}
</script>

<style lang="less" scoped>
.evaluate-tags {
  .tag {
    padding: 2px 13px;
    border: 1px solid #e4e4e4;
    display: inline-block;
    margin-right: 16px;
    margin-bottom: 16px;
    &.active {
      border-color: @xtxColor;
      color: @xtxColor;
    }
  }
}
</style>
